<@override name="content">
<form class="form-horizontal" id="newTopic" action="discuss/save" method="post">
  <div class="control-group topic <#if titleMsg??>error</#if>">
    <label class="control-label" for="inputTitle">Title</label>
    <div class="controls">
      <textarea id="inputTitle" name="topic.title" rows="1" cols="120" placeholder="Title" required></textarea>
      <p class="text-error">${titleMsg!}</p>
    </div>
  </div>
  <div class="control-group topic <#if problemMsg??>error</#if>">
    <label class="control-label" for="inputProblem">Problem</label>
    <div class="controls">
      <input type="number" id="inputProblem" name="topic.pid" min="1000" placeholder="Problem ID">
      <span class="help-inline" id="problemTitle"></span>
      <p class="text-error">${problemMsg!}</p>
    </div>
  </div>
  <div class="control-group notice">
    <label class="ueditor control-label" for="inputContent">Content</label>
    <div class="controls">
      <textarea id="inputContent" name="topic.content" rows="13" cols="120" required></textarea>
    </div>
  </div>
  <div class="control-group">
    <div class="controls">
      <button type="submit" class="btn btn-primary" id="post">Post</button>
      <button type="reset" class="btn btn-info">Reset</button>
    </div>
  </div>
</form>
</@override>
<@override name="scripts">
<link href="assets/bootstrap-wysihtml5/bootstrap-wysihtml5-0.0.2.css" rel="stylesheet" type="text/css"></link>
<script src="assets/bootstrap-wysihtml5/lib/wysihtml5-0.3.0.min.js"></script>
<script src="assets/bootstrap-wysihtml5/bootstrap-wysihtml5-0.0.2.min.js"></script>
<script src="assets/js/ubb.js"></script>

<script type="text/javascript">
  $('#inputContent').wysihtml5({
    //html: true,
    //color: true
  });

  function getProblemTitle() {
    var pid = this.value;
    if (pid >= 1000) {
      $.get("/api/problem/getField", {name: "title", pid: this.value},
              function (data) {
                if (data.result) {
                  $("#problemTitle").html('<a href="problem/show/' + pid + '" target="_blank">' + data.result + '</a>');
                }
                else {
                  $("#problemTitle").html('');
                }
              });
    }
    else {
      $("#problemTitle").html('');
    }
  }
  $("#inputProblem").change(getProblemTitle).keyup(getProblemTitle);

  $("#newTopic").submit(function () {
    var $content = $('#inputContent');
    var html = $content.val();
    html = html2ubb(html);
    $content.data("wysihtml5").editor.setValue(html);
    return true;
  });
</script>
</@override>
<@extends name="../common/_layout.html" />
